import Vue from "vue";
import VueRouter from "vue-router";

import axios from "axios";

//导入页面
import Index from "../views/Index";
//新闻页面
import News from "../views/news/News";
import NewsDetail from "../views/news/NewsDetail";
import NewsList from "../views/news/NewsList";
//产品页面
import Product from "../views/product/Product";
import ProductList from "../views/product/ProductList";
import ProductDetail from "../views/product/ProductDetail";
//公司页面
import Company from "../views/company/Company";
import CompanyList from "../views/company/CompanyList";
//联系我们
import Connect from "../views/connect/Connect";
import ConnectList from "../views/connect/ConnectList";
//素材中心
import Materials from "../views/materials/Materials";
import MaterialsList from "../views/materials/MaterialsList";
//会员中心
import Member from "../views/member/Member";
import MemberList from "../views/member/MemberList";
import MemberInfo from "../views/member/MemberInfo";
import BindAccount from "../views/member/BindAccount";
import MessageCenter from "../views/member/MessageCenter";

Vue.use(VueRouter);

//配置vue全局变量：任意组件--》this.$ajax可使用axios
Vue.prototype.$axios = axios;

Vue.prototype.openLoading = function() {
    const loading = this.$loading({           // 声明一个loading对象
        lock: true,                             // 是否锁屏
        text: '',                     // 加载动画的文字
        spinner: 'el-icon-loading',             // 引入的loading图标
        background: 'rgba(255, 255, 255, 0.9)',       // 背景颜色
        target: '.sub-main',                    // 需要遮罩的区域
        body: true,
        customClass: 'mask'                     // 遮罩层新增类名
    })
    setTimeout(function () {                  // 设定定时器，超时5S后自动关闭遮罩层，避免请求失败时，遮罩层一直存在的问题
        loading.close();                        // 关闭遮罩层
    },3000)
    return loading;
}
//配置路径
const routes = [
    {
        path: '/',
        name: 'Index',
        redirect: '/index'
    }, {
        path: '/index',
        component: Index //注意如果没有路径，不要加{}留空，否则会报错
    }, {
        path: "/news",
        name: "/news",
        component: News,
        children: [
            {
                path: "detail",
                name: "detail",
                component: NewsDetail,
            },
            {
                path: "list",
                name: "list",
                component: NewsList,
            }
        ]
    },{
        path: "/product",
        name: "/product",
        component: Product,
        children: [
            {
                path: "detail",
                name: "detail",
                component: ProductDetail,
            },
            {
                path: "list",
                name: "list",
                component: ProductList,
            }
        ]
    },{
        path: "/company",
        name: "/company",
        component: Company,
        children: [
            {
                path: "list",
                name: "list",
                component: CompanyList,
            }
        ]
    },{
        path: "/connect",
        name: "/connect",
        component: Connect,
        children: [
            {
                path: "list",
                name: "list",
                component: ConnectList,
            }
        ]
    },{
        path: "/materials",
        name: "/materials",
        component: Materials,
        children: [
            {
                path: "list",
                name: "list",
                component: MaterialsList,
            }
        ]
    },{
        path: "/member",
        name: "/member",
        component: Member,
        children: [
            {
                path: "list",
                name: "list",
                component: MemberList,
                children:[
                    {
                        path: "bindAccount",
                        name: "bindAccount",
                        component: BindAccount,
                    },
                    {
                        path: "memberInfo",
                        name: "memberInfo",
                        component: MemberInfo,
                    },
                    {
                        path: "messageCenter",
                        name: "messageCenter",
                        component: MessageCenter,
                    }
                ]
            },

        ]
    }

]

const router = new VueRouter({
    /*
    后端数据请求模式：history
    前端无请求模式#(难以请求后端数据)：hash
     */
    mode: 'history',
    base: process.env.BASE_URL,
    routes
})

//抛出路由
export default router;